<div class="bpm-work">
  <div class="bpm-work-left-ex">
    <ul nz-menu [nzMode]="'inline'" style="height: 100%;">
      <li nz-menu-item (click)="menu.setTab('main')" [nzSelected]="true"><i nz-icon type="setting"></i>流程配置</li>
      <li nz-submenu [nzOpen]="true" *ngIf="config.bpmType!=='3'">
        <span title><i nz-icon type="ordered-list"></i>节点配置</span>
        <ul>
          <li nz-menu-item (click)="changeTask(c)" *ngFor="let c of config.taskConfigs">{{c.taskdefname}}</li>
        </ul>
      </li>
    </ul>
  </div>
  <div class="bpm-work-right-ex">
    <div class="bpm-work-right-ex-content">
      <div class="bpm-tabs" [hidden]="menu.curItem=='task'">
        <h2 class="bpm-tabs-title">
          【{{config.actDefName}}】流程配置
        </h2>
        <table>
          <tr>
            <td class="form-text">
              <nz-form-label nzRequired class="form-label">名称</nz-form-label>
            </td>
            <td class="form-input">
              <nz-form-control class="form-control" [nzValidateStatus]="actDefName.invalid?'error':'success'"
                nzHasFeedback>
                <input nz-input required [(ngModel)]="config.actDefName" id="actDefName" name="actDefName"
                  #actDefName="ngModel">
              </nz-form-control>
            </td>
            <td class="form-text">
              <nz-form-label class="form-label">定义ID</nz-form-label>
            </td>
            <td class="form-input">
              <nz-form-control class="form-control">
                {{config.actDefID}}
              </nz-form-control>
            </td>
          </tr>
          <tr>
            <td class="form-text">
              <nz-form-label nzRequired class="form-label">类型</nz-form-label>
            </td>
            <td class="form-input">
              <nz-form-control class="form-control">
                {{config.bpmTypeName}}
              </nz-form-control>
            </td>
            <td class="form-text">
              <nz-form-label class="form-label">版本</nz-form-label>
            </td>
            <td class="form-input">
              <nz-form-control class="form-control">
                {{config.version}}
              </nz-form-control>
            </td>
          </tr>
          <tr>
            <td class="form-text">
              <nz-form-label class="form-label">访问地址</nz-form-label>
            </td>
            <td class="form-input">
              <nz-form-control class="form-control" [nzValidateStatus]="prjUrl.invalid?'error':'success'" nzHasFeedback>
                <input nz-input required [(ngModel)]="config.prjUrl" name="prjUrl" #prjUrl="ngModel">
              </nz-form-control>
            </td>
            <td class="form-text">
              <nz-form-label nzRequired class="form-label">表单</nz-form-label>
            </td>
            <td class="form-input">
              <nz-form-control class="form-control" [nzValidateStatus]="prjVI.invalid?'error':'success'" nzHasFeedback>
                <input nz-input required [(ngModel)]="config.prjVI" id="prjVI" name="prjVI" #prjVI="ngModel">
              </nz-form-control>
            </td>
          </tr>
          <tr *ngIf="config.bpmType==='1'">
            <td class="form-text">
              <nz-form-label nzRequired class="form-label">流程文件</nz-form-label>
            </td>
            <td class="form-input" colspan="3">
              <nz-form-control class="form-control4">
                <nz-upload nzAction="{{ ffs.getUploadUrl() }}" [nzMultiple]="false" [nzShowButton]="config.FIELD_ISNEW"
                  [nzAccept]="'.bpmn'"
                  [nzShowUploadList]="{ showPreviewIcon: true, showRemoveIcon: config.FIELD_ISNEW }"
                  [(nzFileList)]="config.file" name="file" (nzChange)="ffs.handleChange($event)">
                  <button nz-button><i nz-icon type="upload"></i><span>上传</span></button>
                </nz-upload>
              </nz-form-control>
            </td>
          </tr>
          <tr>
            <td class="form-text">
              <nz-form-label class="form-label">执行角色</nz-form-label>
            </td>
            <td class="form-input" colspan="3">
              <nz-form-control class="form-control4">
                <nz-tree-select class="form-control4" [(ngModel)]="config.roles" name="roles" nzPlaceHolder="请选择"
                  [nzMultiple]="true" [nzDropdownMatchSelectWidth]="true" [nzDropdownStyle]="{ 'max-height': '300px' }"
                  [nzAsyncData]="true" [nzNodes]="pRole.treeDatas">
                </nz-tree-select>
              </nz-form-control>
            </td>
          </tr>
          <tr>
            <td class="form-text">
              <nz-form-label nzRequired class="form-label">统一待办分组名</nz-form-label>
            </td>
            <td class="form-input">
              <nz-form-control class="form-control" [nzValidateStatus]="workname.invalid?'error':'success'" nzHasFeedback>
                <input nz-input required [(ngModel)]="config.workname" name="workname" #workname="ngModel">
              </nz-form-control>
            </td>
            <td class="form-text">
              <nz-form-label class="form-label">时限(小时)</nz-form-label>
            </td>
            <td class="form-input">
              <nz-form-control class="form-control" nzHasFeedback>
                <nz-input-number [(ngModel)]="config.tlTotal" name="tlTotal" [nzMin]="0.5" #tlTotal="ngModel"
                  [nzMax]="100" [nzStep]="0.5" class="form-control">
                </nz-input-number>
              </nz-form-control>
            </td>
          </tr>
          <tr *ngIf="config.bpmType==='1' || config.bpmType==='2'">
            <td class="form-text">
              <nz-form-label nzRequired class="form-label">开始计时节点</nz-form-label>
            </td>
            <td class="form-input">
              <nz-form-control class="form-control" nzHasFeedback>
                <input nz-input [(ngModel)]="config.tlStaTask" name="tlStaTask">
              </nz-form-control>
            </td>
            <td class="form-text">
              <nz-form-label nzRequired class="form-label">结束计时节点</nz-form-label>
            </td>
            <td class="form-input">
              <nz-form-control class="form-control" nzHasFeedback>
                <input nz-input [(ngModel)]="config.tlEndTask" name="tlEndTask">
              </nz-form-control>
            </td>
          </tr>
          <tr *ngIf="config.bpmType==='1'">
            <td class="form-text">
              <nz-form-label class="form-label">流程图</nz-form-label>
            </td>
            <td class="form-input" colspan="3">
              <div align="center" class="bpm-image">
                <img [src]="imageSrc" />
              </div>
            </td>
          </tr>
        </table>
      </div>
      <div class="bpm-tabs" [hidden]="menu.curItem=='main'">
        <h2 class="bpm-tabs-title">
          【{{taskConfig.taskdefname}}】节点配置
        </h2>
        <div class="bpm-tabs-sub">
          <div class="bpm-tabs-sub-ioc"></div>
          <div class="bpm-tabs-sub-h2">基本信息</div>
        </div>
        <table>
          <tr>
            <td class="form-text">
              <nz-form-label nzRequired class="form-label">名称</nz-form-label>
            </td>
            <td class="form-input">
              <nz-form-control class="form-control">
                {{taskConfig.taskdefname}}
              </nz-form-control>
            </td>
            <td class="form-text">
              <nz-form-label nzRequired class="form-label">ID</nz-form-label>
            </td>
            <td class="form-input">
              <nz-form-control class="form-control">
                {{taskConfig.taskdefid}}
              </nz-form-control>
            </td>
          </tr>
          <tr>
            <td class="form-text">
              <nz-form-label class="form-label">节点类型</nz-form-label>
            </td>
            <td class="form-input">
              <nz-form-control class="form-control">
                <nz-select [(ngModel)]="taskConfig.taskType" (nzOpenChange)="taskDic.load('0')" name="taskType" required
                  [nzPlaceHolder]="'请选择'" class="form-control">
                  <nz-option *ngFor="let option of taskDic.datas" [nzLabel]="option.display" [nzValue]="option.id">
                  </nz-option>
                  <nz-option *ngIf="taskDic.isLoading" nzDisabled nzCustomContent>
                    <i nz-icon type="loading" class="loading-icon"></i>加载中...
                  </nz-option>
                  <span *ngIf="!taskDic.isLoaded">
                    <nz-option [nzLabel]="taskConfig.taskTypeName" [nzValue]="taskConfig.taskType">
                    </nz-option>
                  </span>
                </nz-select>
              </nz-form-control>
            </td>
            <td class="form-text">
              <nz-form-label class="form-label">排序号</nz-form-label>
            </td>
            <td class="form-input">
              <nz-form-control class="form-control">
                {{taskConfig.taskorder}}
              </nz-form-control>
            </td>
          </tr>
          <tr>
            <td class="form-text">
              <nz-form-label class="form-label">执行角色</nz-form-label>
            </td>
            <td class="form-input" colspan="3">
              <nz-form-control class="form-control4">
                <nz-tree-select class="form-control4" [(ngModel)]="taskConfig.userrole" name="userrole"
                  nzPlaceHolder="请选择" [nzMultiple]="true" [nzDropdownMatchSelectWidth]="true"
                  [nzDropdownStyle]="{ 'max-height': '300px' }" [nzAsyncData]="true" [nzNodes]="pRole.treeDatas">
                </nz-tree-select>
              </nz-form-control>
            </td>
          </tr>
          <tr>
            <td class="form-text">
              <nz-form-label class="form-label">执行人</nz-form-label>
            </td>
            <td class="form-input">
              <nz-form-control class="form-control">
                <input nz-input [(ngModel)]="taskConfig.userId" name="userId" />
              </nz-form-control>
            </td>
            <td class="form-text">
              <nz-form-label class="form-label">办理时限</nz-form-label>
            </td>
            <td class="form-input">
              <nz-form-control class="form-control">
                <nz-input-number [(ngModel)]="taskConfig.tasktl" name="tasktl" [nzMin]="0.5" [nzMax]="100"
                  [nzStep]="0.5" class="form-control">
                </nz-input-number>
              </nz-form-control>
            </td>
          </tr>
          <tr>
            <td class="form-text">
              <nz-form-label class="form-label">按钮权限</nz-form-label>
            </td>
            <td class="form-input" colspan="3">
              <nz-form-control class="form-control4">
                <label nz-checkbox [(ngModel)]="taskConfig.opttj" name="opttj">提交</label>
                <label nz-checkbox [(ngModel)]="taskConfig.optth" name="optth">退回</label>
                <label nz-checkbox [(ngModel)]="taskConfig.optch" name="optch">撤回</label>
                <label nz-checkbox [(ngModel)]="taskConfig.optcx" name="optcx">撤销</label>
                <label nz-checkbox [(ngModel)]="taskConfig.optjh" name="optjh">激活</label>
                <label nz-checkbox [(ngModel)]="taskConfig.optgq" name="optgq">挂起</label>
                <label nz-checkbox [(ngModel)]="taskConfig.optjg" name="optjg">解挂</label>
                <label nz-checkbox [(ngModel)]="taskConfig.opttz" name="opttz">跳转</label>
                <label nz-checkbox [(ngModel)]="taskConfig.optbc" name="optbc">保存</label>
              </nz-form-control>
            </td>
          </tr>
          <tr>
            <td class="form-text">
              <nz-form-label class="form-label">表单权限</nz-form-label>
            </td>
            <td class="form-input" colspan="3">
              <nz-form-control class="form-control4">
                <input nz-input [(ngModel)]="taskConfig.prjshow" name="prjshow" placeholder="如tj,th" />
              </nz-form-control>
            </td>
          </tr>
        </table>
        <div class="bpm-tabs-sub">
          <div class="bpm-tabs-sub-ioc"></div>
          <div class="bpm-tabs-sub-h2">任务分配</div>
        </div>
        <table>
          <tr>
            <td class="form-text">
              <nz-form-label class="form-label">用户分配</nz-form-label>
            </td>
            <td class="form-input" colspan="3">
              <nz-form-control class="form-control4">
                <textarea nz-input name="userexpress" [(ngModel)]="taskConfig.userexpress"
                  style="height: 300px;"></textarea>
              </nz-form-control>
            </td>
          </tr>
          <tr>
            <td class="form-text">
              <nz-form-label class="form-label">节点分配</nz-form-label>
            </td>
            <td class="form-input" colspan="3">
              <nz-form-control class="form-control4">
                <textarea nz-input name="taskexpress" [(ngModel)]="taskConfig.taskexpress"
                  style="height: 300px;"></textarea>
              </nz-form-control>
            </td>
          </tr>
          <tr>
            <td class="form-text">
              <nz-form-label class="form-label">业务字段</nz-form-label>
            </td>
            <td class="form-input" colspan="3">
              <nz-form-control class="form-control4">
                <input nz-input [(ngModel)]="taskConfig.usercusfld" name="usercusfld" placeholder="如field1,field2" />
              </nz-form-control>
            </td>
          </tr>
          <tr>
            <td class="form-text">
              <nz-form-label class="form-label">分配说明</nz-form-label>
            </td>
            <td class="form-input" colspan="3">
              <textarea nz-input [disabled]="true" contenteditable="true" style="height: 250px;">
  function test(){ return true; }：函数test遵循javascript语法规则，且函数返回值必须为bool类型
  {业务表单字段}：从表单中所取值。所取字段在上级的“提取字段”中。字段都为大写。
  {SP_USERID}：审批用户ID。
  {SP_ORGID}：审批用户的机构ID。
  {SP_DEPTID}：审批用户的部门ID。
  {SP_ZQID}：审批用户的政区ID。
  {JB_USERID}：经办用户ID。
  {JB_ORGID}：经办用户的机构ID。
  {JB_DEPTID}：经办用户的部门ID。
  {JB_ZQID}：经办用户的政区ID。
  {PROJECT_ZQID}：项目所在的行政区ID（县级行政区ID）</textarea>
            </td>
          </tr>
        </table>

        <div class="bpm-tabs-sub">
          <div class="bpm-tabs-sub-ioc"></div>
          <div class="bpm-tabs-sub-h2">任务通知</div>
        </div>
        <table>
          <tr>
            <td class="form-text">通知经办人</td>
            <td class="form-input" colspan="3">
              <label nz-checkbox [(ngModel)]="taskConfig.notjb" name="notjb">通知</label>
            </td>
          </tr>
          <tr>
            <td class="form-text">经办人通知模板</td>
            <td class="form-input" colspan="3">
              <textarea nz-input [(ngModel)]="taskConfig.notjbmb" name="notjbmb" style="height: 120px;"></textarea>
            </td>
          </tr>
          <tr>
            <td class="form-text">通知待办人</td>
            <td class="form-input" colspan="3">
              <label nz-checkbox [(ngModel)]="taskConfig.notdb" name="notdb">通知</label>
            </td>
          </tr>
          <tr>
            <td class="form-text">待办人通知模板</td>
            <td class="form-input" colspan="3">
              <textarea nz-input [(ngModel)]="taskConfig.notdbmb" name="notdbmb" style="height: 120px;"></textarea>
            </td>
          </tr>
          <tr>
            <td class="form-text">通知历史处理人</td>
            <td class="form-input" colspan="3">
              <label nz-checkbox [(ngModel)]="taskConfig.notyb" name="notyb">通知</label>
            </td>
          </tr>
          <tr>
            <td class="form-text">历史处理人通知模板</td>
            <td class="form-input" colspan="3">
              <textarea nz-input [(ngModel)]="taskConfig.notybmb" name="notybmb" style="height: 120px;"></textarea>
            </td>
          </tr>
          <tr>
            <td class="form-text">通知方式</td>
            <td class="form-input" colspan="3">
              <label nz-checkbox [(ngModel)]="taskConfig.notxt" name="notxt">系统通知</label>
              <label nz-checkbox [(ngModel)]="taskConfig.notemail" name="notemail">Email通知</label>
              <label nz-checkbox [(ngModel)]="taskConfig.notmeg" name="notmeg">短信通知</label>
            </td>
          </tr>
          <tr>
            <td class="form-text">自定义通知</td>
            <td class="form-input" colspan="3">
              <nz-form-control class="form-control4">
                <input nz-input [(ngModel)]="taskConfig.notuserdef" name="notuserdef"
                  placeholder="实现ICustomBpmNotice接口类的Spring注册名称" />
              </nz-form-control>
            </td>
          </tr>
          <tr>
            <td class="form-text">通知模板说明</td>
            <td class="form-input" colspan="3">
              <textarea nz-input [disabled]="true" contenteditable="true" style="height: 220px;">
  {BpmDefinitionName}工作流定义名称
  {BpmGroupName}工作流所在分组名称 
  {TaskDefinitionName}当前任务定义名称
  {TaskTitle}流程任务的业务名称 
  {ApplyUser}流程发起人{TaskUser}流程任务的处理人
  {TaskTime}流程任务的处理时间 
  {PreviousUser}前置任务办理人
  {TaskEndTime}任务时限时间 
  {TaskResult}任务处理结果</textarea>
            </td>
          </tr>
        </table>

        <div class="bpm-tabs-sub">
          <div class="bpm-tabs-sub-ioc"></div>
          <div class="bpm-tabs-sub-h2">任务催办</div>
        </div>
        <table>
          <tr>
            <td class="form-text">启用催办</td>
            <td class="form-input" colspan="3">
              <label nz-checkbox [(ngModel)]="taskConfig.remuse" name="remuse">启用</label>
            </td>
          </tr>
          <tr>
            <td class="form-text">催办条件</td>
            <td class="form-input" colspan="3">
              <label>任务创建</label>
              <input style="width: 80px" nz-input [(ngModel)]="taskConfig.remcreate" name="remcreate"
                placeholder="如：2" />
              <label>小时后发送通知</label> <br />

              <label>时限到期</label>
              <input style="width: 80px" nz-input [(ngModel)]="taskConfig.rembefor" name="rembefor" placeholder="如：2" />
              <label>小时前发送通知</label> <br />

              <label>超过时限</label>
              <input style="width: 80px" nz-input [(ngModel)]="taskConfig.remout" name="remout" placeholder="如：2" />
              <label>小时发送通知</label>
            </td>
          </tr>
          <tr>
            <td class="form-text">通知模板</td>
            <td class="form-input" colspan="3">
              <textarea nz-input [(ngModel)]="taskConfig.remmb" name="remmb" style="height: 120px;"></textarea>
            </td>
          </tr>
          <tr>
            <td class="form-text">通知方式</td>
            <td class="form-input" colspan="3">
              <label nz-checkbox [(ngModel)]="taskConfig.remxt" name="remxt">系统通知</label>
              <label nz-checkbox [(ngModel)]="taskConfig.rememail" name="rememail">Email通知</label>
              <label nz-checkbox [(ngModel)]="taskConfig.remmsg" name="remmsg">短信通知</label>
            </td>
          </tr>
          <tr>
            <td class="form-text">自定义催办</td>
            <td class="form-input" colspan="3">
              <input nz-input [(ngModel)]="taskConfig.remuserdef" name="remuserdef"
                placeholder="实现ICustomReminders接口类的Spring注册名称" />
            </td>
          </tr>
          <tr>
            <td class="form-text">通知模板说明</td>
            <td class="form-input" colspan="3">
              <textarea nz-input [disabled]="true" contenteditable="true" style="height: 160px;">
  {BpmDefinitionName}工作流定义名称
  {BpmGroupName}工作流所在分组名称 
  {TaskDefinitionName}当前任务定义名称
  {TaskTitle}流程任务的业务名称 
  {TaskTime}流程任务的处理时间
  {TaskSurplusTime}任务时限时间(小时) 
  {TaskEndTime}任务时限时间</textarea>
            </td>
          </tr>
        </table>
      </div>
    </div>
  </div>
  <div class="content-loading" *ngIf="fs.isLoading || fs.isSaveing">
    <nz-spin [nzSize]="'large'"></nz-spin>
  </div>
</div>
<div class="bpm-foot">
  <div class="tools">
    <div class="item" (click)="save()">
      <i nz-icon type="save" class="icon"></i>
      <span class="text">保存</span>
    </div>
    <div class="item" (click)="close()">
      <i nz-icon type="logout" class="icon"></i>
      <span class="text">关闭</span>
    </div>
  </div>
</div>